Popular Searches
Popular Course Categories
Popular Courses

Element Size and Location

Element Size and Location

Working with Web Elements

Element Size and Location in Selenium

Element Size and Location in Selenium refers to the ability to retrieve the position and dimensions of a web element on a web page. Selenium WebDriver provides methods and properties that allow testers to determine where an element is located and how large it is.

Element location is useful when you need to know the coordinates of an element, while element size is useful for determining its width and height. These properties can be helpful when validating UI layouts, checking element positioning, debugging automation issues, performing visual-related validations, and working with advanced browser interactions.

JustAcademy's Selenium Automation Testing course covers Selenium WebDriver, WebElements, locators, browser automation, TestNG, automation frameworks, Page Object Model, dynamic elements, and real-time automation projects. You can learn more through the Selenium Training Course and register for a Selenium Course Demo.


1. What is Element Size and Location?

Every web element displayed on a web page has a position and a dimension. Selenium WebDriver can retrieve these properties from a WebElement.

Location represents the position of the element on the page or viewport, depending on the WebDriver API or property being used.

Size represents the dimensions of the element, mainly its width and height.

For example, a button may have:

  • X coordinate: 450
  • Y coordinate: 300
  • Width: 120 pixels
  • Height: 40 pixels

This information can be useful when validating the layout or understanding why an element behaves unexpectedly during automation.


2. Why Element Size and Location Are Important

Element size and location can be useful in UI automation because the physical position and dimensions of an element can affect how users interact with the application.

  • Validate element position.
  • Validate element dimensions.
  • Debug UI alignment problems.
  • Understand element coordinates.
  • Support advanced mouse interactions.
  • Validate responsive layouts.
  • Investigate click-related problems.
  • Compare element dimensions across browsers.
  • Support visual testing scenarios.
  • Analyze dynamic UI elements.


3. Selenium WebElement Location

Selenium provides the getLocation() method through the WebElement interface to retrieve the location of an element.

The method returns a Point object.

WebElement element = driver.findElement(By.id("login"));

Point location = element.getLocation();

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());

The Point object contains the X and Y coordinates of the element.


4. Syntax of getLocation()

The basic syntax is:

Point location = element.getLocation();

You can retrieve the individual coordinates using:

int x = location.getX();

int y = location.getY();

Example:

WebElement button = driver.findElement(By.id("login"));

Point point = button.getLocation();

System.out.println("X Coordinate: " + point.getX());

System.out.println("Y Coordinate: " + point.getY());


5. What is Point in Selenium?

The Point class represents the coordinates of an element. It is commonly used with WebElement location information.

Point point = element.getLocation();

A Point contains two primary values:

PropertyDescription
XHorizontal coordinate of the element.
YVertical coordinate of the element.

Example:

System.out.println("X = " + point.getX());

System.out.println("Y = " + point.getY());


6. Understanding X Coordinate

The X coordinate represents the horizontal position of an element.

As the element moves from left to right, its X coordinate generally increases.

WebElement element = driver.findElement(By.id("username"));

Point point = element.getLocation();

System.out.println("X Coordinate: " + point.getX());

For example, if the X coordinate is 250, the element's horizontal position is represented by 250 in the coordinate system returned by WebDriver.


7. Understanding Y Coordinate

The Y coordinate represents the vertical position of an element.

As an element moves downward on the page, its Y coordinate generally increases.

WebElement element = driver.findElement(By.id("username"));

Point point = element.getLocation();

System.out.println("Y Coordinate: " + point.getY());


8. Getting Both X and Y Coordinates

You can retrieve both coordinates from the Point object.

WebElement loginButton = driver.findElement(By.id("login"));

Point location = loginButton.getLocation();

int x = location.getX();

int y = location.getY();

System.out.println("Element X: " + x);

System.out.println("Element Y: " + y);


9. Complete getLocation() Example

import org.openqa.selenium.By;

import org.openqa.selenium.Point;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.chrome.ChromeDriver;

 

public class ElementLocationExample {

    public static void main(String[] args) {

        WebDriver driver = new ChromeDriver();

        driver.manage().window().maximize();

        driver.get("https://example.com");

        WebElement loginButton = driver.findElement(By.id("login"));

        Point location = loginButton.getLocation();

        System.out.println("X Coordinate: " + location.getX());

        System.out.println("Y Coordinate: " + location.getY());

        driver.quit();

    }

}


10. Getting Element Size in Selenium

Selenium provides the getSize() method to retrieve the dimensions of a WebElement.

The method returns a Dimension object.

WebElement button = driver.findElement(By.id("login"));

Dimension size = button.getSize();

System.out.println("Width: " + size.getWidth());

System.out.println("Height: " + size.getHeight());


11. What is Dimension in Selenium?

The Dimension class represents the size of a web element.

A Dimension object mainly contains:

  • Width
  • Height

Dimension dimension = element.getSize();

int width = dimension.getWidth();

int height = dimension.getHeight();


12. Syntax of getSize()

The basic syntax is:

Dimension size = element.getSize();

Then width and height can be retrieved using:

int width = size.getWidth();

int height = size.getHeight();


13. Getting Element Width

The width represents the horizontal dimension of the element.

WebElement button = driver.findElement(By.id("login"));

Dimension size = button.getSize();

System.out.println("Width: " + size.getWidth());

For example, if the returned width is 150, the element has a width of approximately 150 CSS pixels in the WebDriver-reported dimensions.


14. Getting Element Height

The height represents the vertical dimension of the element.

WebElement button = driver.findElement(By.id("login"));

Dimension size = button.getSize();

System.out.println("Height: " + size.getHeight());


15. Getting Width and Height Together

WebElement button = driver.findElement(By.id("login"));

Dimension size = button.getSize();

int width = size.getWidth();

int height = size.getHeight();

System.out.println("Width: " + width);

System.out.println("Height: " + height);


16. Complete getSize() Example

import org.openqa.selenium.By;

import org.openqa.selenium.Dimension;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.chrome.ChromeDriver;

 

public class ElementSizeExample {

    public static void main(String[] args) {

        WebDriver driver = new ChromeDriver();

        driver.manage().window().maximize();

        driver.get("https://example.com");

        WebElement button = driver.findElement(By.id("login"));

        Dimension size = button.getSize();

        System.out.println("Width: " + size.getWidth());

        System.out.println("Height: " + size.getHeight());

        driver.quit();

    }

}


17. Element Location and Size Together

You can retrieve both location and size from the same WebElement.

WebElement button = driver.findElement(By.id("login"));

Point location = button.getLocation();

Dimension size = button.getSize();

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());

System.out.println("Width: " + size.getWidth());

System.out.println("Height: " + size.getHeight());


18. Element Size and Location Flow

Open Browser

    ↓

Open Web Page

    ↓

Locate WebElement

    ↓

Get Element Location

    ↓

Get X and Y Coordinates

    ↓

Get Element Size

    ↓

Get Width and Height

    ↓

Validate UI Properties


19. Difference Between getLocation() and getSize()

MethodPurposeReturn Type
getLocation()Gets the element's positionPoint
getSize()Gets the element's dimensionsDimension

Example:

Point location = element.getLocation();

Dimension size = element.getSize();


20. getLocation() vs getSize() vs getRect()

Selenium also provides the getRect() method, which can provide the element's location and dimensions together.

MethodInformationReturn Type
getLocation()X and Y locationPoint
getSize()Width and HeightDimension
getRect()Location and dimensionsRectangle


21. Using getRect()

The getRect() method provides a convenient way to retrieve both position and size information from a WebElement.

WebElement button = driver.findElement(By.id("login"));

Rectangle rect = button.getRect();

System.out.println("X: " + rect.getX());

System.out.println("Y: " + rect.getY());

System.out.println("Width: " + rect.getWidth());

System.out.println("Height: " + rect.getHeight());


22. getRect() Syntax

Rectangle rectangle = element.getRect();

The Rectangle object provides:

  • X coordinate
  • Y coordinate
  • Width
  • Height


23. Complete getRect() Example

WebElement loginButton = driver.findElement(By.id("login"));

Rectangle rect = loginButton.getRect();

System.out.println("X Position: " + rect.getX());

System.out.println("Y Position: " + rect.getY());

System.out.println("Width: " + rect.getWidth());

System.out.println("Height: " + rect.getHeight());


24. Element Size and Location Using XPath

XPath can be used to locate the element before retrieving its size and location.

WebElement button = driver.findElement(

    By.xpath("//button[@id='login']")

);

Point location = button.getLocation();

Dimension size = button.getSize();

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());

System.out.println("Width: " + size.getWidth());

System.out.println("Height: " + size.getHeight());


25. Element Size and Location Using CSS Selector

WebElement button = driver.findElement(

    By.cssSelector("#login")

);

Point location = button.getLocation();

Dimension size = button.getSize();

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());

System.out.println("Width: " + size.getWidth());

System.out.println("Height: " + size.getHeight());


26. Verify Element Width

TestNG can be used to validate the width of an element.

WebElement button = driver.findElement(By.id("login"));

int width = button.getSize().getWidth();

Assert.assertTrue(width > 0);


27. Verify Element Height

WebElement button = driver.findElement(By.id("login"));

int height = button.getSize().getHeight();

Assert.assertTrue(height > 0);


28. Verify Exact Element Width

If a test requirement specifies an expected width, the actual width can be compared with the expected value.

WebElement button = driver.findElement(By.id("login"));

int actualWidth = button.getSize().getWidth();

int expectedWidth = 120;

Assert.assertEquals(actualWidth, expectedWidth);


29. Verify Exact Element Height

WebElement button = driver.findElement(By.id("login"));

int actualHeight = button.getSize().getHeight();

int expectedHeight = 40;

Assert.assertEquals(actualHeight, expectedHeight);


30. Verify Element Dimensions

WebElement button = driver.findElement(By.id("login"));

Dimension size = button.getSize();

Assert.assertEquals(size.getWidth(), 120);

Assert.assertEquals(size.getHeight(), 40);


31. Verify Element Location

You can compare the actual coordinates with expected coordinates.

WebElement button = driver.findElement(By.id("login"));

Point location = button.getLocation();

Assert.assertEquals(location.getX(), 450);

Assert.assertEquals(location.getY(), 300);


32. Verify X Coordinate

WebElement element = driver.findElement(By.id("username"));

int x = element.getLocation().getX();

System.out.println("X Coordinate: " + x);


33. Verify Y Coordinate

WebElement element = driver.findElement(By.id("username"));

int y = element.getLocation().getY();

System.out.println("Y Coordinate: " + y);


34. Compare Location of Two Elements

Location information can be used to compare the relative position of two elements.

WebElement username = driver.findElement(By.id("username"));

WebElement password = driver.findElement(By.id("password"));

int usernameY = username.getLocation().getY();

int passwordY = password.getLocation().getY();

if (passwordY > usernameY) {

    System.out.println("Password field is below username field");

}


35. Compare Width of Two Elements

WebElement username = driver.findElement(By.id("username"));

WebElement password = driver.findElement(By.id("password"));

int usernameWidth = username.getSize().getWidth();

int passwordWidth = password.getSize().getWidth();

if (usernameWidth == passwordWidth) {

    System.out.println("Both fields have the same width");

}


36. Compare Height of Two Elements

WebElement button1 = driver.findElement(By.id("login"));

WebElement button2 = driver.findElement(By.id("register"));

int height1 = button1.getSize().getHeight();

int height2 = button2.getSize().getHeight();

if (height1 == height2) {

    System.out.println("Both buttons have the same height");

}


37. Check Whether Element Is Below Another Element

WebElement heading = driver.findElement(By.id("heading"));

WebElement button = driver.findElement(By.id("login"));

int headingY = heading.getLocation().getY();

int buttonY = button.getLocation().getY();

if (buttonY > headingY) {

    System.out.println("Button is below the heading");

}


38. Check Whether Element Is To the Right

WebElement leftElement = driver.findElement(By.id("left"));

WebElement rightElement = driver.findElement(By.id("right"));

int leftX = leftElement.getLocation().getX();

int rightX = rightElement.getLocation().getX();

if (rightX > leftX) {

    System.out.println("Right element is positioned to the right");

}


39. Element Size in Responsive Testing

Responsive web applications may change element dimensions depending on viewport size. Selenium can retrieve the current dimensions of elements after changing the browser window size.

WebElement menu = driver.findElement(By.id("menu"));

System.out.println("Desktop Width: " + menu.getSize().getWidth());

System.out.println("Desktop Height: " + menu.getSize().getHeight());


40. Browser Window Size vs Element Size

Browser window size and element size are different concepts.

PropertyDescription
Browser Window SizeDimensions of the browser window.
Element SizeWidth and height of a particular WebElement.
Element LocationPosition of a particular WebElement.

Example:

Dimension windowSize = driver.manage().window().getSize();

System.out.println("Browser Width: " + windowSize.getWidth());

System.out.println("Browser Height: " + windowSize.getHeight());


41. Setting Browser Window Size

Selenium allows the browser window size to be changed using the WebDriver window management API.

driver.manage().window().setSize(new Dimension(1280, 720));

After changing the viewport or browser window configuration, an element's dimensions and location may change depending on the application's responsive design.


42. Getting Browser Window Size

Dimension windowSize = driver.manage().window().getSize();

System.out.println("Width: " + windowSize.getWidth());

System.out.println("Height: " + windowSize.getHeight());


43. Element Location After Scrolling

Scrolling can affect how an element is positioned relative to the viewport. When testing scrolling-related behavior, it is important to understand the difference between document coordinates and viewport-related positioning.

WebElement element = driver.findElement(By.id("footer"));

Point location = element.getLocation();

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());


44. Scrolling to an Element

JavaScript can be used when a test needs to scroll an element into view.

WebElement element = driver.findElement(By.id("footer"));

JavascriptExecutor js = (JavascriptExecutor) driver;

js.executeScript(

    "arguments[0].scrollIntoView(true);",

    element

);

After scrolling, the element can be inspected again for visibility, location, or other properties.


45. Element Location and JavaScript

JavaScript can also be used to retrieve browser-level bounding rectangle information.

WebElement element = driver.findElement(By.id("login"));

JavascriptExecutor js = (JavascriptExecutor) driver;

Object rect = js.executeScript(

    "return arguments[0].getBoundingClientRect().toJSON();",

    element

);

System.out.println(rect);

The JavaScript bounding rectangle can provide information such as top, left, width, height, right, and bottom relative to the viewport.


46. getBoundingClientRect() vs getLocation()

FeaturegetLocation()getBoundingClientRect()
APISelenium WebElement APIBrowser JavaScript API
Primary UseElement locationDetailed viewport rectangle
CoordinatesX and YTop, left, right, bottom and more
SizeNot returned directlyWidth and height available


47. Element Rectangle

The rectangle of an element can be represented as:

Top

 ↓

+----------------------+

|                      |

|       Element        |  Height

|                      |

+----------------------+

←------ Width --------→

The element also has a horizontal X position and vertical Y position.


48. Practical Example: Login Form

Suppose a login form contains a username field, password field, and login button. Selenium can retrieve the location and dimensions of each element.

WebElement username = driver.findElement(By.id("username"));

WebElement password = driver.findElement(By.id("password"));

WebElement login = driver.findElement(By.id("login"));

System.out.println("Username X: " + username.getLocation().getX());

System.out.println("Username Y: " + username.getLocation().getY());

System.out.println("Username Width: " + username.getSize().getWidth());

System.out.println("Username Height: " + username.getSize().getHeight());

System.out.println("Password X: " + password.getLocation().getX());

System.out.println("Password Y: " + password.getLocation().getY());

System.out.println("Login Width: " + login.getSize().getWidth());

System.out.println("Login Height: " + login.getSize().getHeight());


49. Practical Example: Verify Login Form Alignment

WebElement username = driver.findElement(By.id("username"));

WebElement password = driver.findElement(By.id("password"));

int usernameX = username.getLocation().getX();

int passwordX = password.getLocation().getX();

if (usernameX == passwordX) {

    System.out.println("Username and password fields are aligned");

} else {

    System.out.println("Fields are not aligned");

}


50. Practical Example: Verify Equal Button Sizes

WebElement login = driver.findElement(By.id("login"));

WebElement register = driver.findElement(By.id("register"));

Dimension loginSize = login.getSize();

Dimension registerSize = register.getSize();

if (loginSize.equals(registerSize)) {

    System.out.println("Buttons have equal dimensions");

} else {

    System.out.println("Buttons have different dimensions");

}


51. Practical Example: E-Commerce Product Card

Element size and location can be used while analyzing product cards, product images, buttons, prices, and filters.

WebElement productImage = driver.findElement(By.cssSelector(".product-image"));

WebElement addToCart = driver.findElement(By.cssSelector(".add-to-cart"));

Dimension imageSize = productImage.getSize();

Point imageLocation = productImage.getLocation();

Dimension buttonSize = addToCart.getSize();

Point buttonLocation = addToCart.getLocation();

System.out.println("Image Width: " + imageSize.getWidth());

System.out.println("Image Height: " + imageSize.getHeight());

System.out.println("Image X: " + imageLocation.getX());

System.out.println("Image Y: " + imageLocation.getY());

System.out.println("Button Width: " + buttonSize.getWidth());

System.out.println("Button Height: " + buttonSize.getHeight());

System.out.println("Button X: " + buttonLocation.getX());

System.out.println("Button Y: " + buttonLocation.getY());


52. Practical Example: Navigation Menu

WebElement menu = driver.findElement(By.id("menu"));

Point location = menu.getLocation();

Dimension size = menu.getSize();

System.out.println("Menu X: " + location.getX());

System.out.println("Menu Y: " + location.getY());

System.out.println("Menu Width: " + size.getWidth());

System.out.println("Menu Height: " + size.getHeight());


53. Practical Example: Form Field Dimensions

List<WebElement> fields = driver.findElements(By.cssSelector("input"));

for (WebElement field : fields) {

    System.out.println("Width: " + field.getSize().getWidth());

    System.out.println("Height: " + field.getSize().getHeight());

    System.out.println("X: " + field.getLocation().getX());

    System.out.println("Y: " + field.getLocation().getY());

}


54. Verify All Input Fields Have Width

List<WebElement> fields = driver.findElements(By.cssSelector("input"));

for (WebElement field : fields) {

    int width = field.getSize().getWidth();

    Assert.assertTrue(width > 0);

}


55. Verify All Input Fields Have Height

List<WebElement> fields = driver.findElements(By.cssSelector("input"));

for (WebElement field : fields) {

    int height = field.getSize().getHeight();

    Assert.assertTrue(height > 0);

}


56. Element Size with TestNG

TestNG can be used to validate expected dimensions.

@Test

public void verifyButtonSize() {

    WebElement button = driver.findElement(By.id("login"));

    int width = button.getSize().getWidth();

    int height = button.getSize().getHeight();

    Assert.assertTrue(width > 0);

    Assert.assertTrue(height > 0);

}


57. Element Location with TestNG

@Test

public void verifyElementLocation() {

    WebElement button = driver.findElement(By.id("login"));

    Point location = button.getLocation();

    Assert.assertTrue(location.getX() >= 0);

    Assert.assertTrue(location.getY() >= 0);

}


58. Element Size and Location with Page Object Model

In the Page Object Model, reusable methods can be created to retrieve element dimensions and coordinates.

public class LoginPage {

    private WebDriver driver;

    private By loginButton = By.id("login");

    public LoginPage(WebDriver driver) {

        this.driver = driver;

    }

    public int getLoginButtonWidth() {

        return driver.findElement(loginButton)

                .getSize()

                .getWidth();

    }

    public int getLoginButtonHeight() {

        return driver.findElement(loginButton)

                .getSize()

                .getHeight();

    }

    public Point getLoginButtonLocation() {

        return driver.findElement(loginButton)

                .getLocation();

    }

}


59. Using Page Object Methods in Test

LoginPage loginPage = new LoginPage(driver);

System.out.println(

    "Width: " + loginPage.getLoginButtonWidth()

);

System.out.println(

    "Height: " + loginPage.getLoginButtonHeight()

);

Point location = loginPage.getLoginButtonLocation();

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());


60. Element Size and Location with Explicit Wait

When elements appear dynamically, it is better to wait until the element is present before retrieving its properties.

WebDriverWait wait = new WebDriverWait(

    driver,

    Duration.ofSeconds(10)

);

WebElement button = wait.until(

    ExpectedConditions.presenceOfElementLocated(

        By.id("login")

    )

);

Dimension size = button.getSize();

Point location = button.getLocation();

System.out.println("Width: " + size.getWidth());

System.out.println("Height: " + size.getHeight());

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());


61. Element Size After Dynamic Page Update

Modern web applications may change the size or location of an element after JavaScript execution, AJAX requests, animations, or responsive layout changes.

WebElement element = driver.findElement(By.id("dynamicElement"));

System.out.println("Initial Width: " + element.getSize().getWidth());

driver.findElement(By.id("expand")).click();

System.out.println("Updated Width: " + element.getSize().getWidth());


62. Handling Stale Element with Size and Location

If the DOM is refreshed or an element is recreated, the previously stored WebElement may become stale.

try {

    WebElement element = driver.findElement(By.id("dynamicElement"));

    System.out.println(

        "Width: " + element.getSize().getWidth()

    );

    System.out.println(

        "X: " + element.getLocation().getX()

    );

} catch (StaleElementReferenceException e) {

    System.out.println(

        "Element became stale and must be located again"

    );

}


63. Difference Between Element Size and Browser Size

FeatureElement SizeBrowser Size
RepresentsSize of a specific WebElementSize of the browser window
APIelement.getSize()driver.manage().window().getSize()
WidthElement widthWindow width
HeightElement heightWindow height


64. Difference Between Element Location and Browser Position

Element location represents where an element is positioned within the web page context, while browser window position represents where the browser window itself is positioned on the operating system screen.

Point elementLocation = element.getLocation();

Point browserPosition = driver.manage()

        .window()

        .getPosition();


65. Get Browser Window Position

Point position = driver.manage().window().getPosition();

System.out.println("Browser X: " + position.getX());

System.out.println("Browser Y: " + position.getY());


66. Element Size and Location for UI Validation

UI validation can use size and location information to verify whether important elements have expected dimensions and positions.

  • Verify login button dimensions.
  • Verify input field alignment.
  • Verify header dimensions.
  • Verify navigation menu position.
  • Verify product card dimensions.
  • Verify footer position.
  • Verify responsive layout behavior.


67. Element Size and Location in Responsive Testing

Responsive testing checks whether the UI adapts correctly to different viewport or browser sizes. Element dimensions and coordinates can be collected at different browser sizes and compared.

driver.manage().window().setSize(new Dimension(1280, 720));

WebElement menu = driver.findElement(By.id("menu"));

System.out.println(

    "Desktop Width: " + menu.getSize().getWidth()

);

driver.manage().window().setSize(new Dimension(768, 1024));

System.out.println(

    "Tablet Width: " + menu.getSize().getWidth()

);


68. Element Size and Location in Mobile-Responsive Testing

When testing responsive web pages, elements may change position, width, height, visibility, or layout depending on the viewport.

driver.manage().window().setSize(new Dimension(375, 812));

WebElement menu = driver.findElement(By.id("menu"));

Dimension size = menu.getSize();

Point location = menu.getLocation();

System.out.println("Width: " + size.getWidth());

System.out.println("Height: " + size.getHeight());

System.out.println("X: " + location.getX());

System.out.println("Y: " + location.getY());


69. Element Size and Location for Buttons

WebElement submit = driver.findElement(By.id("submit"));

Dimension size = submit.getSize();

Point location = submit.getLocation();

System.out.println("Submit Button Width: " + size.getWidth());

System.out.println("Submit Button Height: " + size.getHeight());

System.out.println("Submit Button X: " + location.getX());

System.out.println("Submit Button Y: " + location.getY());


70. Element Size and Location for Images

WebElement image = driver.findElement(By.cssSelector(".product-image"));

Dimension size = image.getSize();

Point location = image.getLocation();

System.out.println("Image Width: " + size.getWidth());

System.out.println("Image Height: " + size.getHeight());

System.out.println("Image X: " + location.getX());

System.out.println("Image Y: " + location.getY());


71. Element Size and Location for Text Fields

WebElement username = driver.findElement(By.id("username"));

Dimension size = username.getSize();

Point location = username.getLocation();

System.out.println("Username Width: " + size.getWidth());

System.out.println("Username Height: " + size.getHeight());

System.out.println("Username X: " + location.getX());

System.out.println("Username Y: " + location.getY());


72. Element Size and Location for Checkboxes

WebElement checkbox = driver.findElement(By.id("terms"));

Dimension size = checkbox.getSize();

Point location = checkbox.getLocation();

System.out.println("Checkbox Width: " + size.getWidth());

System.out.println("Checkbox Height: " + size.getHeight());

System.out.println("Checkbox X: " + location.getX());

System.out.println("Checkbox Y: " + location.getY());


73. Element Size and Location for Radio Buttons

WebElement radio = driver.findElement(By.id("male"));

Dimension size = radio.getSize();

Point location = radio.getLocation();

System.out.println("Radio Width: " + size.getWidth());

System.out.println("Radio Height: " + size.getHeight());

System.out.println("Radio X: " + location.getX());

System.out.println("Radio Y: " + location.getY());


74. Practical Project Using Element Size and Location

A practical Selenium project can use element size and location to perform basic UI validation across a complete application.

Open Browser

    ↓

Open Application

    ↓

Set Browser Window Size

    ↓

Locate Login Form

    ↓

Get Username Location

    ↓

Get Username Size

    ↓

Get Password Location

    ↓

Get Password Size

    ↓

Compare Field Alignment

    ↓

Get Login Button Location

    ↓

Get Login Button Size

    ↓

Validate Button Dimensions

    ↓

Login

    ↓

Open Product Page

    ↓

Inspect Product Card Size

    ↓

Inspect Product Image Location

    ↓

Open Checkout

    ↓

Inspect Payment Controls

    ↓

Validate UI Properties

    ↓

Complete Test


75. Practical Project Example

WebElement username = driver.findElement(By.id("username"));

WebElement password = driver.findElement(By.id("password"));

WebElement login = driver.findElement(By.id("login"));

Point usernameLocation = username.getLocation();

Point passwordLocation = password.getLocation();

Dimension usernameSize = username.getSize();

Dimension passwordSize = password.getSize();

Dimension loginSize = login.getSize();

System.out.println("Username X: " + usernameLocation.getX());

System.out.println("Username Y: " + usernameLocation.getY());

System.out.println("Password X: " + passwordLocation.getX());

System.out.println("Password Y: " + passwordLocation.getY());

System.out.println("Username Width: " + usernameSize.getWidth());

System.out.println("Username Height: " + usernameSize.getHeight());

System.out.println("Password Width: " + passwordSize.getWidth());

System.out.println("Password Height: " + passwordSize.getHeight());

System.out.println("Login Width: " + loginSize.getWidth());

System.out.println("Login Height: " + loginSize.getHeight());

Assert.assertTrue(usernameSize.getWidth() > 0);

Assert.assertTrue(passwordSize.getWidth() > 0);

Assert.assertTrue(loginSize.getWidth() > 0);


76. Best Practices for Element Size and Location

  • Use getLocation() when you need the element's coordinates.
  • Use getSize() when you need the element's width and height.
  • Use getRect() when you need both location and dimensions together.
  • Use meaningful locators before retrieving element properties.
  • Use explicit waits when elements are dynamically created.
  • Re-locate elements when the DOM is frequently refreshed.
  • Use TestNG assertions for automated validation.
  • Do not assume that coordinates are constant across different viewport sizes.
  • Consider responsive design when comparing element positions.
  • Use JavaScript bounding rectangles when viewport-relative geometry is specifically required.
  • Do not use element coordinates as a replacement for reliable locators.
  • Use Page Object Model methods for reusable UI property validation.


77. Common Mistakes

  • Confusing element location with browser window position.
  • Confusing element size with browser window size.
  • Assuming coordinates remain identical across all screen resolutions.
  • Checking dimensions before a dynamic element has appeared.
  • Using stale WebElements after a DOM refresh.
  • Expecting getLocation() to return width and height.
  • Expecting getSize() to return X and Y coordinates.
  • Using coordinates as primary element locators.
  • Ignoring responsive layout changes.
  • Comparing exact coordinates without considering application layout behavior.


78. Advantages of Element Size and Location

AdvantageDescription
UI ValidationHelps validate element dimensions and positions.
DebuggingUseful for investigating layout and positioning issues.
Responsive TestingHelps compare element behavior at different viewport sizes.
Automation SupportProvides geometry information for advanced interactions.
Layout TestingCan help verify alignment and spacing-related requirements.
Dimension ValidationAllows testers to validate width and height.
Position ValidationAllows testers to inspect X and Y coordinates.


79. Limitations of Element Size and Location

  • Element coordinates can change when the browser window or viewport changes.
  • Responsive layouts can produce different element dimensions.
  • Animations can temporarily change location or size.
  • Dynamic DOM updates can invalidate a previously stored WebElement.
  • Coordinates alone do not prove that an element is clickable.
  • Location values should not normally be used as the primary way to identify elements.
  • Exact pixel comparisons can be sensitive to browser, viewport, zoom, and rendering differences.


80. Quick Reference

RequirementRecommended Method
Get element locationgetLocation()
Get X coordinategetLocation().getX()
Get Y coordinategetLocation().getY()
Get element sizegetSize()
Get widthgetSize().getWidth()
Get heightgetSize().getHeight()
Get location and size togethergetRect()
Get browser window sizedriver.manage().window().getSize()
Get browser window positiondriver.manage().window().getPosition()
Validate dimensionsTestNG assertions
Viewport rectangleJavaScript getBoundingClientRect()


81. Interview Questions

Q1. What is getLocation() in Selenium?

getLocation() is a WebElement method used to retrieve the location of an element. It returns a Point object containing the X and Y coordinates.

Q2. What is the return type of getLocation()?

The return type is Point.

Q3. How do you get the X coordinate of an element?

int x = element.getLocation().getX();

Q4. How do you get the Y coordinate of an element?

int y = element.getLocation().getY();

Q5. What is getSize() in Selenium?

getSize() is a WebElement method used to retrieve the dimensions of an element.

Q6. What is the return type of getSize()?

The return type is Dimension.

Q7. How do you get the width of an element?

int width = element.getSize().getWidth();

Q8. How do you get the height of an element?

int height = element.getSize().getHeight();

Q9. What is the difference between getLocation() and getSize()?

getLocation() returns the position of an element, while getSize() returns its width and height.

Q10. What is getRect() in Selenium?

getRect() returns a Rectangle object containing the element's location and dimensions.

Q11. Can element size be verified using TestNG?

Yes. TestNG assertions can be used to compare actual element width and height with expected values.

Assert.assertEquals(element.getSize().getWidth(), 120);

Q12. Can element location be verified using TestNG?

Yes. X and Y coordinates can be retrieved and compared with expected values.

Q13. Can getLocation() and getSize() be used together?

Yes. They can be used together to retrieve an element's position and dimensions.

Q14. Does getLocation() return width and height?

No. getLocation() returns the element's location through a Point object. Width and height can be obtained using getSize() or getRect().

Q15. Does getSize() return X and Y coordinates?

No. getSize() returns the element's width and height through a Dimension object.

Q16. Can element location change during responsive testing?

Yes. Changing the browser viewport or responsive layout can change an element's position and dimensions.

Q17. Can dynamic DOM updates affect element size and location?

Yes. If an element is recreated or replaced, a previously stored WebElement may become stale and must be located again.

Q18. Should coordinates be used as the primary locator?

No. Reliable Selenium locators such as ID, name, CSS selectors, and XPath should normally be used to identify elements.


82. Best Practices Checklist

  • Use getLocation() for X and Y coordinates.
  • Use getSize() for width and height.
  • Use getRect() when both position and dimensions are required.
  • Use Point for location information.
  • Use Dimension for size information.
  • Use Rectangle for combined geometry information.
  • Use explicit waits for dynamic elements.
  • Use TestNG assertions for UI property validation.
  • Consider viewport size during responsive testing.
  • Re-locate elements after DOM replacement.
  • Avoid using coordinates as primary element locators.
  • Use Page Object Model for reusable size and location methods.
  • Use JavaScript bounding rectangles when viewport-relative measurements are required.


83. Conclusion

Element Size and Location are useful Selenium WebDriver concepts for understanding and validating the geometry of web elements. The getLocation() method can be used to retrieve an element's X and Y coordinates, while getSize() can be used to retrieve its width and height.

The getRect() method provides a convenient way to work with both location and dimensions together. These methods can be useful in UI validation, responsive testing, layout verification, debugging, and advanced automation scenarios.

Element size and location should be used carefully because coordinates and dimensions can change with viewport size, responsive layouts, animations, browser differences, and dynamic DOM updates. For reliable Selenium automation, size and location checks should be combined with stable locators, explicit waits, assertions, and Page Object Model practices.

JustAcademy's Selenium Training provides learning around Selenium WebDriver, WebElements, locators, browser automation, TestNG, automation frameworks, dynamic elements, and practical automation projects. Visit the JustAcademy Selenium Training Course to learn more. For a course demonstration, use the JustAcademy Course Demo Registration.

whatsapp